<template>
  <div class="news">
    <div class="mt-3">
       <div class="new_top m-auto"></div>
      <h3 class="mt-1">Contact us</h3>
      <h4>联系我们</h4>
    </div>
    <div class="flex flex-column align-start ml-5 mr-5 mtCenter">
      <h4>古交市煤炭交易联系方式</h4>
      <div>
        <span>地 址：太原金牛大厦义学路87号</span>
        <span>邮 编：030200</span>
        <span>联系电话：(0351)5141594</span>
      </div>
    </div>
    <div class="map ml-5 mt-3">
      <p>地理位置</p>
      <img src="../../../assets/img/map.png" alt="">
    </div>
  </div>
</template>

<script>
export default {};
</script>

<style lang="stylus" scoped>
.news {
  text-align: center;
  height: 700px;
  width: 860px;
  height: 580px;
  border: 1px solid #D2D2D2;
  margin-right: 30px;

  h3 {
    font-size: 32px;
    color: #333333;
  }

  h4 {
    font-size: 24px;
    font-weight: 400;
    color: #0B0B0C;
    margin-top: -20px;
  }
}

.mtCenter {
  h4 {
    font-size: 18px;
    font-weight: bold;
    color: #303030;
  }

  span {
    font-size: 16px;
    color: #303030;
    line-height: 26px;
    margin-right: 72px;
  }
}

.map {
  text-align: left;

  p {
    font-size: 16px;
    font-weight: bold;
    color: #303030;
  }
}
</style>